<template>
	<view>
		<view class="wishes-wrapper" style="padding: 10px;">
			<view class="wish create">
			    <view class="wish-content" style=''>
			        <image mode="widthFix" src="../../static/logo.png"/>
			        <view style="margin-left: 10px;">健康11</view>
			        <view style="font-size: 12px;color:#18BC37;margin-left: 10px;">实时监控中</view>
					<button @click="opendoor" size="mini" style="width: 80%;" type="primary">立即开门</button><!-- 这种写法只有h5平台支持，不跨端，不推荐使用 -->
			    </view>
			</view>
			<view class="wish create">
			    <view class="wish-content" style=''>
			        <image mode="widthFix" src="../../static/logo.png"/>
			        <view style="margin-left: 10px;">健康xxxxx</view>
			        <view style="font-size: 12px;color:#18BC37;margin-left: 10px;">实时监控中</view>
					<button @click="opendoor" size="mini" style="width: 90%;" type="primary">立即开门</button><!-- 这种写法只有h5平台支持，不跨端，不推荐使用 -->
			    </view>
			</view>
		</view>
		
		<uni-popup ref="popup" type="center" :animation="false">
			<uni-popup-dialog mode="input" message="尊敬的业主:" :duration="2000" :before-close="true" @close="close" @confirm="confirmCommunity">
				<view style="background-color: #fff;width: 100%;padding: 10px;">
					<view style="color: gray;font-size: 12px;">系统正在为您开启 xxxxx，是否确认开启</view>
				</view>
			</uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			}
		},
		onLoad() {

		},
		methods: {
			opendoor() {
				this.$refs.popup.open()
			},
			close() {
				this.$refs.popup.close()
			},
			confirmCommunity() {
				this.$refs.popup.close()
			},
		}
	}
</script>

<style lang="scss">
	.wishes-wrapper {
	    // margin-right: -5px;
	    .wish {
				  width: 49%;
				  text-align: center;
	        vertical-align: top;
	        background: #fff;
	        border-radius: 10px;
	        width: rpx(349);
	        display: inline-block;
	        margin-right: 5px;
	        font-size: 14px;
				  margin: 0 0 10px 0;
	
	        &.create {
	            min-height: 227.8px;
	            .wish-content {
	                display: flex;
	                flex-direction: column;
						  border-radius: 10px 10px 0 0;
						  border: 1px solid #eee;
						  padding-bottom: 10px;
						  text-align: left;
	
	                image {
	                    height: 140px;
	                    width: 100%;
	                }
	            }
	        }
	    }
	    .wish:nth-child(even) {
	        vertical-align: top;
	        background: #fff;
	        border-radius: 10px;
	        width: rpx(349);
	        display: inline-block;
	        font-size: 14px;
				  float: right;
				  margin: 0 0 10px 0;
	
	        &.create {
	            min-height: 227.8px;
	            .wish-content {
	                display: flex;
	                flex-direction: column;
						  border-radius: 10px 10px 0 0;
						  border: 1px solid #eee;
						  padding-bottom: 10px;
	                text-align: left;
	
	                image {
	                    height: 140px;
	                    width: 100%;
	                }
	            }
	        }
	    }
	}
</style>
